<template>
  <div class="app-container">
    <el-form :model="groupQuery" ref="groupQuery" :inline="true" v-show="showSearch" class="globalSerchFormStyle"
      label-width="68px">
      <el-row>
        <el-col :span="6">
          <el-form-item label="油企名称" prop="enterpriseId">
            <el-select v-model="groupQuery.enterpriseId" placeholder="请选择油企" size="small" filterable clearable
              style="width: 190px" @change="handleSelectChange">
              <el-option v-for="(item, index) in enterpriseList" :key="index" :label="item.enterpriseName"
                :value="item.enterpriseId"></el-option>
            </el-select>
          </el-form-item>
        </el-col>
        <!-- <el-col :span="6">
          <el-form-item label="油站名称" prop="stationId">
            <el-select
              v-model="groupQuery.stationId"
              placeholder="请选择油站"
              size="small"
              filterable
              clearable
              style="width: 190px"
            >
              <el-option
                v-for="item in stationListQuery"
                :key="item.stationId"
                :label="item.stationName"
                :value="item.stationId"
              ></el-option>
            </el-select>
          </el-form-item>
        </el-col> -->
        <el-col :span="6">
          <el-form-item label="油企ID" prop="enterpriseId2">
            <el-input v-model="groupQuery.enterpriseId2" placeholder="请输入油企ID" clearable size="small"
              style="width: 190px" />
          </el-form-item>
        </el-col>
        <el-col :span="6">
          <el-form-item label="油企编码" prop="enterpeiseCode">
            <el-input v-model="groupQuery.enterpeiseCode" placeholder="请输入油企编码" clearable size="small"
              style="width: 190px" />
          </el-form-item>
        </el-col>
        <el-col :span="6">
          <el-form-item label="油企状态" prop="status">
            <el-select v-model="groupQuery.status" placeholder="状态" clearable size="small" style="width: 190px">
              <el-option label="启用" value="1" />
              <el-option label="停用" value="0" />
            </el-select>
          </el-form-item>
        </el-col>
      </el-row>

      <el-row v-show="collapse">
        <el-col :span="6">
          <el-form-item label="创建时间" prop="createdDate">
            <el-date-picker v-model="dateRangeCreatedDate" size="small" style="width: 190px"
              value-format="yyyy-MM-dd HH:mm:ss" type="datetimerange" range-separator="至" start-placeholder="开始日期"
              end-placeholder="结束日期">
            </el-date-picker>
          </el-form-item>
        </el-col>
        <!-- <el-col :span="6">
          <el-form-item label="所在地区" prop="cityValue">
            <yf-city />
          </el-form-item>
        </el-col> -->
      </el-row>
    </el-form>

    <el-row class="global_el_rowStyle" :gutter="10">
      <el-col :span="1.5">
        <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
      </el-col>
      <el-col :span="1.5">
        <el-button icon="el-icon-refresh" size="mini" @click="resetQuery" type="primary" plain>重置</el-button>
      </el-col>
      <el-col :span="1.5">
        <el-button plain size="mini" style="margin-left: 10px" id="closeSearchBtn"
          @click="(closeSearch) => { collapse = !collapse;} ">{{ collapse ? "收起" : "展开更多" }}<i
            :class="collapse ? 'el-icon-arrow-up ' : 'el-icon-arrow-down'"></i></el-button>
      </el-col>
      <el-col :span="1.5">
        <el-button type="primary" size="mini" @click="handleGroupAdd" plain>新增油企</el-button>
      </el-col>
      <el-col :span="1.5">
        <el-button size="mini">导出</el-button>
      </el-col>
      <el-col :span="1.5">
        <el-button id="test" size="mini" @click="handleTest()" plain>第三方授权</el-button>
      </el-col>
    </el-row>

    <!-- <el-card class="card-table">
      <el-row class="mb8">
        <right-toolbar :showSearch.sync="showSearch" @queryTable="handleQuery"></right-toolbar>
      </el-row> -->

    <el-table :data="groupList" v-loading="groupLoading" stripe>
      <af-table-column label="序号" width="50">
        <template slot-scope="scope">{{(groupQuery.pageNum - 1) * groupQuery.pageSize + scope.$index + 1}}</template>
      </af-table-column>
      <af-table-column prop="enterpriseId" label="油企Id" align="left">
      </af-table-column>
      <af-table-column prop="enterpriseName" label="油企名称" align="left">
      </af-table-column>
      <af-table-column prop="enterpeiseCode" label="油企编码" align="left">
      </af-table-column>
      <af-table-column label="平台模式" prop="isPlatformFlag" align="left">
        <template slot-scope="scope">
          {{ scope.row.isPlatformFlag == "0" ? "否" : "" }}
          {{ scope.row.isPlatformFlag == "1" ? "是" : "" }}
        </template>
      </af-table-column>
      <af-table-column label="油企状态" prop="status" align="left">
        <template slot-scope="scope">
          {{ scope.row.status == "1" ? "启用" : "" }}
          {{ scope.row.status == "0" ? "停用" : "" }}
        </template>
      </af-table-column>
      <af-table-column align="left" prop="appName" label="小程序名称" />
      <af-table-column align="left" prop="gzhAppName" label="公众号名称" />
      <af-table-column align="left" prop="leader" label="联系人">
      </af-table-column>
      <af-table-column align="left" prop="phone" label="联系电话">
      </af-table-column>
      <af-table-column align="left" prop="regionDataList" label="省市区">
        <template slot-scope="scope">
          {{!scope.row.regionDataList? "": translateCodeToAddress(scope.row.regionDataList).toString()}}
        </template>
      </af-table-column>
      <af-table-column align="left" prop="detailRegionData" label="详情地址" />
      <af-table-column align="left" prop="licenseNo" label="营业执照编号" />
      <!-- <af-table-column align="left" prop="corporateBank" label="开户行">
      </af-table-column>
      <af-table-column align="left" prop="corporateAccount" label="开户行账号">
      </af-table-column>
      <af-table-column
        align="left"
        prop="corporateAccountName"
        label="开户行账户名"
      >
      </af-table-column>
      <af-table-column align="left" prop="serviceCharge" label="手续费">
      </af-table-column> -->
      <af-table-column align="left" prop="createDate" label="创建时间" />
      <af-table-column align="left" prop="updatedTime" label="最近一次修改时间" />
      <af-table-column label="操作" align="left" fixed="right" prop="payDate" width="330px">
        <template slot-scope="scope">
          <el-button type="text" @click="handleGroupEdit(scope.row)" size="mini" style="margin: 0px 5px">编辑</el-button>
          <el-button type="text" @click="handlePayListOpen(scope.row)" size="mini"
            style="margin: 0px 5px">查看支付渠道</el-button>
          <el-button type="text" @click="exportQr(scope.row)" size="mini" style="margin: 0px 5px">导出二维码</el-button>
          <el-button type="text" @click="onRateSetting(scope.row)" size="mini" style="margin: 0px 5px">费率设置</el-button>
          <!--
            <el-button
              type="text"
              @click="handleOilTankListOpen(scope.row)"
              size="mini"
              style="margin: 0px 5px"
              >查看油罐</el-button
            >
            -->
          <el-button type="text" @click="handleGroupDel(scope.row)" size="mini" style="margin: 0px 5px">删除</el-button>
        </template>
      </af-table-column>
    </el-table>
    <!-- </el-card> -->
    <pagination :hidden="groupListTotal > 0 ? false : true" :total="groupListTotal" :page.sync="groupQuery.pageNum"
      :limit.sync="groupQuery.pageSize" @pagination="getGroupList" :autoScroll="true" />

    <!-- 添加油企 -->
    <!-- <el-dialog :title="groupTitle" :visible.sync="groupOpen" width="800px" append-to-body> -->
    <el-drawer :title="groupTitle" size="40%" :visible.sync="groupOpen" direction="rtl" custom-class="add-drawer">
      <el-form style="padding: 0 20px 0 20px" ref="groupForm" :model="groupForm" :rules="groupRules" label-width="80px"
        label-position="top">
        <el-row>
          <el-col :span="24">
            <div style="font-size: 22px; font-weight: bolder; margin-top: 20px">基本信息
              <hr />
            </div>
          </el-col>
          <el-col :span="11">
            <el-form-item label="油企名称" prop="enterpriseName"
              :rules="{   required: true,   message: '请选择油企名称',   trigger: 'change', }">
              <el-input v-model="groupForm.enterpriseName" placeholder="请输入部门名称" />
            </el-form-item>
          </el-col>

          <!-- <el-col :span="11" :offset="1">
            <el-form-item label="平台模式" prop="isPlatformFlag" :rules="{
              required: true,
              message: '请选择平台模式',
              trigger: 'change',
            }">
              <el-select v-model="groupForm.isPlatformFlag" placeholder="请选择是否为平台模式" clearable :style="{ width: '100%' }">
                <el-option label="是" value="1"></el-option>
                <el-option label="否" value="0"></el-option>
              </el-select>
            </el-form-item>
          </el-col> -->
          <!--
          <el-col :span="11">
            <el-form-item label="是否启用支付宝">
              <el-select
                v-model="groupForm.isAlipayFlag"
                placeholder="请选择是否启用支付宝"
                clearable
                :style="{ width: '100%' }"
              >
                <el-option label="启用" :value="1"></el-option>
                <el-option label="停用" :value="0"></el-option>
              </el-select>
            </el-form-item>
          </el-col>
          -->

          <el-col :span="11" :offset="1">
            <el-form-item label="联系人" prop="leader"
              :rules="{   required: true,   message: '请填写联系人',   trigger: 'change', }">
              <el-input v-model="groupForm.leader" placeholder="请输入联系人" maxlength="20" />
            </el-form-item>
          </el-col>

          <el-col :span="11">
            <el-form-item label="联系电话" prop="phone"
              :rules="{   required: true,  message: '请填写联系电话',   trigger: 'change', }">
              <el-input v-model="groupForm.phone" placeholder="请输入联系电话" maxlength="11" />
            </el-form-item>
          </el-col>

          <el-col :span="11" :offset="1">
            <el-form-item label="省市区" prop="regionDataList">
              <el-cascader size="large" :options="regionDataOptions" v-model="groupForm.regionDataList"
                @change="handleChangeRegionData" :style="{ width: '100%' }" clearable placeholder="请选择省市区">
              </el-cascader>
            </el-form-item>
          </el-col>

          <el-col :span="11">
            <el-form-item label="详情地址" prop="detailRegionData">
              <el-input v-model="groupForm.detailRegionData" placeholder="请填写详细地址" maxlength="50" />
            </el-form-item>
          </el-col>

          <el-col :span="11" :offset="1">
            <el-form-item label="营业执照编号" prop="licenseNo">
              <el-input v-model="groupForm.licenseNo" placeholder="请输入营业执照编号" maxlength="50" />
            </el-form-item>
          </el-col>

          <!-- <el-col :span="24">
            <el-form-item label="营业执照上传" prop="licenseImg">
              <el-upload
                class="avatar-uploader"
                :action="imgUpConfig.addressUrl"
                :headers="imgUpConfig.headers"
                :show-file-list="false"
                accept="image/gif,image/jpeg,image/png,image/jpg,image/bmp"
                :before-upload="beforeAvatarUpload"
                :on-success="handleAvatarSuccess"
              >
                <img
                  v-if="groupForm.licenseImg"
                  :src="groupForm.licenseImg"
                  class="avatar"
                />

                <i v-else class="el-icon-plus avatar-uploader-icon"></i>
                <div class="el-upload__tip" slot="tip">
                  只能上传图片文件，图片不超过1M
                </div>
              </el-upload>
            </el-form-item>
          </el-col> -->

          <!-- <el-col :span="24">
            <div style="font-size: 22px; font-weight: bolder; margin-top: 20px">
              银行信息
              <hr />
            </div>
          </el-col>
          <el-col :span="11">
            <el-form-item label="开户行" prop="corporateBank">
              <el-input
                v-model="groupForm.corporateBank"
                placeholder="请输入开户行名称"
                maxlength="50"
              />
            </el-form-item>
          </el-col>

          <el-col :span="11" :offset="1">
            <el-form-item label="开户行账号" prop="corporateAccount">
              <el-input
                v-model="groupForm.corporateAccount"
                placeholder="请输入对公账户"
                maxlength="50"
              />
            </el-form-item>
          </el-col>

          <el-col :span="11">
            <el-form-item label="开户行账户名" prop="corporateAccountName">
              <el-input
                v-model="groupForm.corporateAccountName"
                placeholder="请输入开户行账户名"
                maxlength="50"
              />
            </el-form-item>
          </el-col>
          <el-col :span="11" :offset="1">
            <el-form-item
              label="手续费"
              prop="serviceCharge"
              :rules="{
                required: true,
                message: '请填写手续费',
                trigger: 'change',
              }"
            >
              <el-input
                v-model="groupForm.serviceCharge"
                placeholder="请输入手续费"
                maxlength="50"
              >
                <template slot="append">‰</template>
              </el-input>
            </el-form-item>
          </el-col> -->

          <el-col :span="24" v-if="groupForm.isPlatformFlag != 1">
            <div style="font-size: 22px; font-weight: bolder; margin-top: 20px">
              小程序信息
              <hr />
            </div>
          </el-col>
          <el-col :span="11" v-if="groupForm.isPlatformFlag != 1">
            <el-form-item label="小程序名称" prop="appName">
              <el-input v-model="groupForm.appName" maxlength="50" placeholder="请输入小程序名称" />
            </el-form-item>
          </el-col>

          <el-col :span="11" :offset="1" v-if="groupForm.isPlatformFlag != 1">
            <el-form-item label="小程序AppId" prop="appId">
              <!--            :rules="{
                required: (groupForm.isPlatformFlag!=1),
                message: '请填写小程序AppId',
                trigger: 'change',
              }" -->
              <el-input v-model="groupForm.appId" maxlength="50" placeholder="请输入小程序AppId" />
            </el-form-item>
          </el-col>
          <el-col :span="11" v-if="groupForm.isPlatformFlag != 1">
            <el-form-item label="小程序AppSecret" prop="appSecret">
              <!-- :rules="{
                required: (groupForm.isPlatformFlag!=1),
                message: '请填写小程序AppSecret',
                trigger: 'change',
              }" -->
              <el-input v-model="groupForm.appSecret" maxlength="50" placeholder="请输入小程序AppSecret" />
            </el-form-item>
          </el-col>

          <el-col :offset="1" :span="11" v-if="groupForm.isPlatformFlag != 1">
            <el-form-item label="小程序原始Id" prop="originId">
              <!-- :rules="{
                required: (groupForm.isPlatformFlag!=1),
                message: '请填写小程序原始Id',
                trigger: 'change',
              }" -->
              <el-input v-model="groupForm.originId" maxlength="50" placeholder="请输入小程序原始Id" />
            </el-form-item>
          </el-col>

          <el-col :span="24" v-if="groupForm.isPlatformFlag != 1">
            <div style="font-size: 22px; font-weight: bolder; margin-top: 20px">
              公众号信息
              <hr />
            </div>
          </el-col>
          <el-col :span="11" :offset="1" v-if="groupForm.isPlatformFlag != 1">
            <el-form-item label="会员卡头像" prop="cardLogo"
              :rules="{   required: !!groupForm.gzhAppId,   message: '请上传会员卡头像',   trigger: 'change', }">
              <el-upload class="avatar-uploader" :action="imgUpConfig.addressUrl" :headers="imgUpConfig.headers"
                :show-file-list="false" accept="image/gif,image/jpeg,image/png,image/jpg,image/bmp"
                :before-upload="beforeAvatarUpload" :on-success="handleCardLogoSuccess">
                <img v-if="groupForm.cardLogo" :src="groupForm.cardLogo" class="avatar" />

                <i v-else class="el-icon-plus avatar-uploader-icon"></i>
                <div class="el-upload__tip" slot="tip">
                  只能上传图片文件，图片不超过1M
                </div>
              </el-upload>
            </el-form-item>
          </el-col>

          <el-col :span="11" v-if="groupForm.isPlatformFlag != 1">
            <el-form-item label="公众号名称" prop="gzhAppName">
              <el-input v-model="groupForm.gzhAppName" maxlength="50" placeholder="请输入公众号名称" />
            </el-form-item>
          </el-col>

          <el-col :span="11" v-if="groupForm.isPlatformFlag != 1">
            <el-form-item label="公众号AppId" prop="gzhAppId">
              <el-input v-model="groupForm.gzhAppId" maxlength="50" placeholder="请输入公众号AppId" />
            </el-form-item>
          </el-col>

          <el-col :span="11" v-if="groupForm.isPlatformFlag != 1">
            <el-form-item label="公众号AppSecret" prop="gzhAppSecret">
              <el-input :disabled="true" v-model="groupForm.gzhAppSecret" maxlength="50"
                placeholder="请输入公众号AppSecret" />
            </el-form-item>
          </el-col>

          <el-col :span="11" :offset="1" v-if="groupForm.isPlatformFlag != 1">
            <el-form-item label="会员卡" prop="gzhAppSecret">
              <!--
              <el-input
                v-model="groupForm.gzhAppSecret"
                maxlength="50"
                placeholder="请输入公众号AppSecret"
              />
              
            -->
              <el-input v-if="!!groupForm.cardId" v-model="groupForm.cardId" disabled maxlength="50"
                placeholder="请输入公众号AppSecret" />
              <el-button v-else :loading="wxCardLoading" @click="setWxCardId">点击生成会员卡</el-button>
              <div style="font-size: 12px; color: #606266; margin-top: 7px">
                点击此按钮前，请先填写公众号的相关信息
              </div>
            </el-form-item>
          </el-col>

          <!-- <el-col :span="24" v-if="groupForm.isPlatformFlag != 1">
            <el-form-item label="优惠卷推送模板Id" prop="templateId">
              <el-input
                v-model="groupForm.templateId"
                placeholder="优惠卷推送模板Id"
              />
            </el-form-item>
          </el-col> -->

          <el-col :span="24">
            <div style="font-size: 22px; font-weight: bolder; margin-top: 20px">
              状态
              <hr />
            </div>
          </el-col>
          <el-col :span="11">
            <el-form-item label="油企状态" prop="status" :rules="{ required: true, message: '请选择油企状态', trigger: 'change',}">
              <el-select v-model="groupForm.status" placeholder="请选择油企状态" clearable :style="{ width: '100%' }">
                <el-option label="启用" value="1"></el-option>
                <el-option label="停用" value="0"></el-option>
              </el-select>
            </el-form-item>
          </el-col>

          <!-- 
          <el-col :span="11" :offset="1">
            <el-form-item
              label="小程序展示价格油品"
              prop="appletShowOilNamePrice"
            >
              <el-input
                v-model="groupForm.appletShowOilNamePrice"
                placeholder="油品名称"
                maxlength="50"
              />
            </el-form-item>
          </el-col>

          <el-col :span="11">
            <el-form-item label="客服栏广告位id" prop="dialogueAdId">
              <el-input
                v-model="groupForm.dialogueAdId"
                placeholder="客服栏广告位id"
                maxlength="50"
              />
            </el-form-item>
          </el-col> -->

          <!-- <el-col :span="11" :offset="1">
            <el-form-item
              label="消息推送消息模板id"
              prop="sendMessageTemplateId"
            >
              <el-input
                v-model="groupForm.sendMessageTemplateId"
                placeholder="推送消息模板id"
                maxlength="50"
              />
            </el-form-item>
          </el-col> -->

          <el-col :span="11" :offset="1">
            <el-form-item label="是否开启闪付" prop="sfFlag">
              <el-radio-group v-model="groupForm.sfFlag">
                <el-radio label="0">否</el-radio>
                <el-radio label="1">是</el-radio>
              </el-radio-group>
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>
      <div class="fr" style="margin: 20px">
        <el-button type="primary" @click="groupSubmitForm" size="mini">确 定</el-button>
        <el-button @click="groupCancel" size="mini">取 消</el-button>
      </div>
      <!-- </el-dialog> -->
    </el-drawer>
    <!-- 费率设置 -->
    <el-drawer title="费率设置" label="rtl" :visible.sync="drawerRate" size="45%" custom-class="add_ratedrawer"
      :before-close="handleClose">
      <el-form v-show="!isSepaRate" :model="formValidateForm" ref="formValidateForm" label-width="230px">
        <el-form-item label="随行付商户号:" prop="merchantNumber"
          :rules="[{ required: true, message: '请选择随行付商户号（最多20位整数）'},{ message: '请选择随行付商户号（最多20位整数）'}]">
          <el-select v-model="formValidateForm.merchantNumber" placeholder="请选择随行付商户号" style="width:100%;"
            @change="getRate">
            <el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value"></el-option>
          </el-select>
        </el-form-item>
        <div v-loading="vLoading">
          <el-form-item :label="`微信当前费率：${wxrate}‰`" />
          <el-form-item label="微信预约生效费率：" prop="wxrate"
            :rules="[{ required: true, message: '请输入值，值必须在2.1-10.0之间，最多一位小数' },{ pattern:/^(?:2\.[1-9]|[3-9](?:\.\d)?|10(?:\.0)?)$/, message: '请输入值，值必须在2.1-10之间，最多一位小数' }]">
            <el-input v-model="formValidateForm.wxrate" autocomplete="off" placeholder="请输入值，值必须在2.1-10.0之间，最多一位小数">
              <template slot="append">‰</template></el-input>
          </el-form-item>
          <el-form-item :label="`支付宝当前费率:${zfbrate}‰`" />
          <el-form-item label="支付宝预约生效费率：" prop="zfbrate"
            :rules="[{ required: true, message: '请输入值，值必须在2.1-10.0之间，最多一位小数' },{ pattern:/^(?:2\.[1-9]|[3-9](?:\.\d)?|10(?:\.0)?)$/, message: '请输入值，值必须在2.1-10之间，最多一位小数' }]">
            <el-input v-model="formValidateForm.zfbrate" autocomplete="off" placeholder="请输入值，值必须在2.1-10.0之间，最多一位小数">
              <template slot="append">‰</template></el-input>
          </el-form-item>
          <el-form-item :label="  `银联（<1000）当前费率：${yldrate1}‰ `" />
          <el-form-item label="银联预约生效费率：" prop="ylrate"
            :rules="[{ required: true, message: '请输入值，值必须在2.3-10.0之间，最多一位小数' },{ pattern:/^(?:2\.[3-9]|[3-9](?:\.\d)?|10(?:\.0)?)$/, message: '请输入值，值必须在2.3-10.0之间，最多一位小数' }]">
            <el-input v-model="formValidateForm.ylrate" autocomplete="off" placeholder="请输入值，值必须在2.3-10.0之间，最多一位小数">
              <template slot="append">‰</template></el-input>
          </el-form-item>
          <el-form-item :label=" `银联（>1000）当前费率：${yldrate2}‰ `" />
          <el-form-item label="银联预约生效费率：" prop="ylrate2"
            :rules="[{ required: true, message: '请输入值，值必须在5.4-10.0之间，最多一位小数' },{ pattern:/^(?:5\.[4-9]|[6-9](?:\.\d)?|10(?:\.0)?)$/, message: '请输入值，值必须在5.4-10.0之间，最多一位小数' }]">
            <el-input v-model="formValidateForm.ylrate2" autocomplete="off" placeholder="请输入值，值必须在5.4-10.0之间，最多一位小数">
              <template slot="append">‰</template></el-input>
          </el-form-item>
          <div class="bank_rate">
            <el-form-item :label=" `银行卡借记卡当前费率：${yhjjrate}‰`"></el-form-item>
            <el-form-item :label=" `银行卡贷记卡当前费率: ${yhdjrate}‰`"></el-form-item>
          </div>
          <el-form-item label="银行卡借记卡预约生效费率：" prop="jjkrate"
            :rules="[{ required: true, message: '请输入值，值必须在4.4-10.0之间，最多一位小数' },{ pattern:/^(?:4\.[4-9]|[5-9](?:\.\d)?|10(?:\.0)?)$/, message: '请输入值，值必须在4.4-10.0之间，最多一位小数' }]">
            <el-input v-model="formValidateForm.jjkrate" autocomplete="off" placeholder="请输入值，值必须在4.4-10.0之间，最多一位小数">
              <template slot="append">‰</template></el-input>
          </el-form-item>
          <el-form-item label="银行卡贷记卡预约生效费率：" prop="djkrate"
            :rules="[{ required: true, message: '请输入值，值必须在5.4-10.0之间，最多一位小数' },{ pattern:/^(?:5\.[4-9]|[6-9](?:\.\d)?|10(?:\.0)?)$/, message: '请输入值，值必须在5.4-10.0之间，最多一位小数' }]">
            <el-input v-model="formValidateForm.djkrate" autocomplete="off" placeholder="请输入值，值必须在5.4-10.0之间，最多一位小数">
              <template slot="append">‰</template></el-input>
          </el-form-item>
          <el-form-item :label=" `借记卡当前封顶：${yhkfdrate}`"></el-form-item>
          <el-form-item label="借记卡当前封顶：" prop="fdrate"
            :rules="[{ required: true, message: '请输入值不低于18.75，最多两位小数' },{ validator:validateInput, message: '请输入值不低于18.75，最多两位小数' }]">
            <el-input v-model="formValidateForm.fdrate" autocomplete="off" placeholder="请输入值不低于18.75，最多两位小数"></el-input>
          </el-form-item>
        </div>

        <!-- <el-form-item class="act_btn_set"><div @click="onSepaRate(1)">借贷分离设置</div></el-form-item> -->
        <el-form-item class="act_btn">
          <el-button @click="onResetForm">取消</el-button>
          <el-button type="primary" @click="onSubmitForm">提交</el-button>
        </el-form-item>
      </el-form>
      <!--借贷分离模块 -->
      <!-- <el-form  v-show="isSepaRate" :model="formValidateFormSepa" ref="formValidateFormSepa" label-width="250px">
        <el-form-item label="随行付商户号:" prop="merchantNumber" :rules="[{ required: true, message: '请选择随行付商户号（最多20位整数）'},{ message: '请选择随行付商户号（最多20位整数）'}]">
          <el-select v-model="formValidateFormSepa.merchantNumber" placeholder="请选择随行付商户号（最多20位整数）" style="width:100%;" @change="getRate">
            <el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value"></el-option>
          </el-select>
        </el-form-item>
        <div class="bank_rate">
          <el-form-item :label=" `微信借记卡当前费率：${flrate.wxjjk_rate}‰`"></el-form-item>
          <el-form-item :label=" `微信贷记卡当前费率：${flrate.wxdjk_rate}‰`"></el-form-item>
        </div>
        <el-form-item label="微信借记卡预约生效费率：" prop="wxjjkrate" :rules="[{ required: true, message: '请输入值，值必须在2.1-10.0之间，最多一位小数' },{ pattern: /^([2-9](\.\d{1})?|10)$/, message: '请输入值，值必须在2.1-10之间，最多一位小数' }]">
          <el-input v-model="formValidateFormSepa.wxjjkrate" autocomplete="off"  placeholder='请输入值，值必须在2.1-10.0之间，最多一位小数'> <template slot="append">‰</template></el-input>
        </el-form-item>
        <el-form-item label="微信贷记卡预约生效费率：" prop="wxdjkrate" :rules="[{ required: true, message: '请输入值，值必须在2.1-10.0之间，最多一位小数' },{ pattern: /^([2-9](\.\d{1})?|10)$/, message: '请输入值，值必须在2.1-10之间，最多一位小数' }]">
          <el-input v-model="formValidateFormSepa.wxdjkrate" autocomplete="off" placeholder='请输入值，值必须在2.1-10.0之间，最多一位小数'> <template slot="append">‰</template></el-input>
        </el-form-item>
        <div class="bank_rate">
          <el-form-item :label="`支付宝借记卡当前费率：${flrate.zfbjjk_rate}‰ `"></el-form-item>
          <el-form-item :label="`支付宝贷记卡当前费率：${flrate.zfdjjk_rate}‰`"></el-form-item>
        </div>
        <el-form-item label="支付宝借记卡预约生效费率：" prop="zfbjjkrate" :rules="[{ required: true, message: '请输入值，值必须在2.1-10.0之间，最多一位小数' },{ pattern: /^([2-9](\.\d{1})?|10)$/, message: '请输入值，值必须在2.1-10之间，最多一位小数' }]">
          <el-input v-model="formValidateFormSepa.zfbjjkrate" autocomplete="off" placeholder='请输入值，值必须在2.1-10.0之间，最多一位小数'> <template slot="append">‰</template></el-input>
        </el-form-item>
        <el-form-item label="支付宝贷记卡预约生效费率：" prop="zfbdjkrate" :rules="[{ required: true, message: '请输入值，值必须在2.1-10.0之间，最多一位小数' },{ pattern: /^([2-9](\.\d{1})?|10)$/, message: '请输入值，值必须在2.1-10之间，最多一位小数' }]">
          <el-input v-model="formValidateFormSepa.zfbdjkrate" autocomplete="off" placeholder='请输入值，值必须在2.1-10.0之间，最多一位小数'> <template slot="append">‰</template></el-input>
        </el-form-item>
        <div class="bank_rate">
          <el-form-item :label="`银联(<1000)借当前费率：${flrate.yldjjk_rate}‰ `"></el-form-item>
          <el-form-item :label="`银联(>1000)贷当前费率：${flrate.yldjk_rate2}‰ `"></el-form-item>
        </div>
        <el-form-item label="银联借预约生效费率：" prop="yljrate" :rules="[{ required: true, message: '请输入值，值必须在4.4-10.0之间，最多一位小数' },{ pattern: /^([4-9](\.\d{1})?|10(\.0)?)$/, message: '请输入值，值必须在4.4-10.0之间，最多一位小数' }]">
          <el-input v-model="formValidateFormSepa.yljrate" autocomplete="off" placeholder='请输入值，值必须在4.4-10.0之间，最多一位小数'> <template slot="append">‰</template></el-input>
        </el-form-item>
        <el-form-item label="银联贷预约生效费率：" prop="yldrate" :rules="[{ required: true, message: '请输入值，值必须在5.4-10.0之间，最多一位小数' },{ pattern: /^([5-9](\.\d{1})?|10(\.0)?)$/, message: '请输入值，值必须在5.4-10.0之间，最多一位小数' }]">
          <el-input v-model="formValidateFormSepa.yldrate" autocomplete="off" placeholder='请输入值，值必须在5.4-10.0之间，最多一位小数'> <template slot="append">‰</template></el-input>
        </el-form-item>
        <div class="bank_rate">
          <el-form-item :label=" `银行卡借记卡当前费率：${yhjjrate}‰`"></el-form-item>
          <el-form-item :label=" `银行卡贷记卡当前费率: ${yhdjrate}‰`"></el-form-item>
        </div>
        <el-form-item label="银行卡借记卡预约生效费率：" prop="jjkrate" :rules="[{ required: true, message: '请输入值，值必须在4.4-10.0之间，最多一位小数' },{ pattern: /^([4-9](\.\d{1})?|10(\.0)?)$/, message: '请输入值，值必须在4.4-10.0之间，最多一位小数' }]">
          <el-input v-model="formValidateFormSepa.jjkrate" autocomplete="off" placeholder="请输入值，值必须在4.4-10.0之间，最多一位小数"> <template slot="append">‰</template></el-input>
        </el-form-item>
        <el-form-item label="银行卡贷记卡预约生效费率：" prop="djkrate" :rules="[{ required: true, message: '请输入值，值必须在4.4-10.0之间，最多一位小数' },{ pattern: /^([4-9](\.\d{1})?|10(\.0)?)$/, message: '请输入值，值必须在4.4-10.0之间，最多一位小数' }]">
          <el-input v-model="formValidateFormSepa.djkrate" autocomplete="off" placeholder="请输入值，值必须在4.4-10.0之间，最多一位小数"> <template slot="append">‰</template></el-input>
        </el-form-item>
        <el-form-item :label=" `借记卡当前封顶：${yhkfdrate}`"></el-form-item>
        <el-form-item label="借记卡当前封顶：" prop="fdrate" :rules="[{ required: true, message: '请输入值不低于18.75，最多两位小数' },{ pattern: /^(1[89](\.\d{1,2})?|[2-9]\d(\.\d{1,2})?|100(\.0{1,2})?)$/, message: '请输入值，值必须在2.1-10之间，最多一位小数' }]">
          <el-input v-model="formValidateFormSepa.fdrate" autocomplete="off" placeholder="请输入值不低于18.75，最多两位小数"></el-input>
        </el-form-item>
        <el-form-item class="act_btn_set"><div @click="onSepaRate(2)">不设借贷分离</div></el-form-item>
        <el-form-item class="act_btn">
          <el-button @click="onResetForm">取消</el-button>
          <el-button type="primary" @click="onSubmitForm">提交</el-button>
        </el-form-item>
      </el-form> -->
    </el-drawer>

    <!-- 配置支付渠道 -->
    <el-dialog :title="'支付渠道列表'" :visible.sync="payConfOpen" width="800px" append-to-body>
      <el-form ref="payConfForm" :model="payConfForm" :rules="rules" label-width="80px" label-position="top">
        <el-col :span="23">
          <el-form-item label="应用渠道" prop="appType" :rules="{ required: true, message: '请填写应用渠道', trigger: 'change',}">
            <el-select v-model="payConfForm.appType" placeholder="请选择支付渠道应用的类型" clearable :style="{ width: '100%' }">
              <el-option label="微信" value="1"></el-option>
              <el-option label="支付宝" value="2"></el-option>
              <el-option label="银行卡" value="3"></el-option>
              <el-option label="POS机" value="4"></el-option>
            </el-select>
          </el-form-item>
        </el-col>
        <el-col :span="11">
          <el-form-item label="使用类型" prop="useType" :rules="{ required: true, message: '请填写使用类型', trigger: 'change',}">
            <el-select @change="handleChangeUseType" v-model="payConfForm.useType" placeholder="请选择支付渠道的类型" clearable :style="{ width: '100%' }">
              <el-option label="消费" value="1"></el-option>
              <el-option label="充值" value="0" :disabled="payConfForm.appType === '4'"></el-option>
            </el-select>
          </el-form-item>
        </el-col>
        <el-col :span="11" :offset="1">
          <el-form-item label="支付渠道类型" :rules="{ required: true, message: '请填写支付渠道类型', trigger: 'change',}" prop="payType">
            <el-select v-model="payConfForm.payType" placeholder="请选择支付渠道" clearable :style="{ width: '100%' }">
              <el-option label="随行付" value="1"></el-option>
              <el-option label="云闪付" value="2" :disabled="payConfForm.appType === '4'"></el-option>
              <el-option label="通联支付" value="3" :disabled="payConfForm.appType === '4'"></el-option>
              <el-option label="金控支付" value="4" :disabled="payConfForm.appType === '4'"></el-option>
              <el-option label="云化支付" value="5"></el-option>
            </el-select>
          </el-form-item>
        </el-col>

        <el-col :span="23">
          <el-form-item label="通道费承担方" :rules="{ required: true, message: '请选择承担方', trigger: 'change',}" prop="channelFeePayer">
            <el-radio-group v-model="payConfForm.channelFeePayer">
              <el-radio label="1">油企</el-radio>
              <el-radio label="0" :disabled="payConfForm.useType === '0'">司机</el-radio>
            </el-radio-group>
          </el-form-item>
        </el-col>

        <el-col :span="23">
          <el-form-item label="费率" prop="serviceCharge" :rules="{ required: true, message: '请填写费率', trigger: 'blur',}">
            <el-input v-model.trim="payConfForm.serviceCharge" maxlength="50" placeholder="请输入费率，以千分位为单位">
              <template slot="append">‰</template>
            </el-input>
          </el-form-item>
        </el-col>
        <el-col :span="23">
          <el-form-item label="备注" prop="remark" :rules="{ message: '请填备注', trigger: 'blur',}">
            <el-input v-model.trim="payConfForm.remark" maxlength="50" placeholder="请输入备注">
            </el-input>
          </el-form-item>
        </el-col>
        <el-col :span="24" v-if="payConfForm.payType == '1'">
          <div style="font-size: 22px; font-weight: bolder; margin-top: 20px">
            随行付配置
            <hr />
          </div>
        </el-col>

        <el-col :span="11" v-if="payConfForm.payType == '1'">
          <el-form-item label="随行付商户号" prop="mno" :rules="{ required: payConfForm.payType == '1', message: '请填写随行付商户号', trigger: 'change',}">
            <el-input v-model="payConfForm.mno" maxlength="50" placeholder="请输入随行付商户号" />
          </el-form-item>
        </el-col>

        <el-col :span="11" :offset="1" v-if="payConfForm.payType == '1'">
          <el-form-item label="是否分账" prop="fusRuleStatus" :rules="{ required: payConfForm.payType == '1', message: '请选择是否分账', trigger: 'change',}">
            <el-select v-model="payConfForm.fusRuleStatus" placeholder="请选择是否启用分账" clearable :style="{ width: '100%' }">
              <el-option label="启用分账" value="1"></el-option>
              <el-option label="禁用分账" value="0"></el-option>
            </el-select>
          </el-form-item>
        </el-col>

        <el-col :span="23" v-if="payConfForm.fusRuleStatus == '1'">
          <el-form-item label="分账收款商户编号" prop="fusRuleMnoArray" :rules="{ required: payConfForm.fusRuleStatus == '1', message: '请填写分账收款商户编号', trigger: 'change',}">
            <el-input v-model="payConfForm.fusRuleMnoArray" maxlength="50" placeholder="请输入分账收款商户编号" />
            <span style="font-size: 12px; color: rgb(150 163 194 / 67%)">多个商户号码请用英文逗号隔开</span>
          </el-form-item>
        </el-col>

        <el-col :span="23" v-if="payConfForm.fusRuleStatus == '1'">
          <el-form-item label="分账比例" prop="fusRuleProportionArray" :rules="{ required: payConfForm.fusRuleStatus == '1', message: '请填写分账比例', trigger: 'change',}">
            <el-input v-model="payConfForm.fusRuleProportionArray" maxlength="50" placeholder="请输入分账账号比例" />
            <span style="font-size: 12px; color: rgb(150 163 194 / 67%)">按商户号顺序，依次填入分账比例，用英文逗号隔开</span>
          </el-form-item>
        </el-col>

        <el-col :span="24" v-if="payConfForm.payType == '2'">
          <div style="font-size: 22px; font-weight: bolder; margin-top: 20px">
            云闪付配置
            <hr />
          </div>
        </el-col>

        <el-col :span="11" v-if="payConfForm.payType == '2'">
          <el-form-item label="商户号" prop="mno">
            <el-input v-model="payConfForm.mno" maxlength="50" placeholder="请输入商户号" />
          </el-form-item>
        </el-col>

        <el-col :span="11" :offset="1" v-if="payConfForm.payType == '2'">
          <el-form-item label="终端号" prop="terminalNo">
            <el-input v-model="payConfForm.terminalNo" maxlength="50" placeholder="请输入终端号" />
          </el-form-item>
        </el-col>

        <el-col :span="23" v-if="payConfForm.payType == '2'">
          <el-form-item label="密钥" prop="secretKey">
            <el-input v-model="payConfForm.secretKey" maxlength="50" placeholder="请输入密钥" />
          </el-form-item>
        </el-col>
        <el-col :span="24" v-if="payConfForm.payType == '4'">
          <div style="font-size: 22px; font-weight: bolder; margin-top: 20px">
            金控支付配置
            <hr />
          </div>
        </el-col>

        <el-col :span="23" v-if="payConfForm.payType == '4'">
          <el-form-item label="金控商户号" prop="mno" :rules="{ required: payConfForm.payType == '4', message: '请填写金控商户号', trigger: 'change',}">
            <el-input v-model="payConfForm.mno" maxlength="50" placeholder="请输入金控的商户号" />
          </el-form-item>
        </el-col>
        <el-col :span="24" v-if="payConfForm.payType == '5'">
          <div style="font-size: 22px; font-weight: bolder; margin-top: 20px">
            云化支付配置
            <hr />
          </div>
        </el-col>

        <el-col :span="11" v-if="payConfForm.payType == '5'">
          <el-form-item label="支付编号" prop="mno" :rules="{ required: true, message: '请输入商户号', trigger: 'blur',}">
            <el-input v-model="payConfForm.mno" maxlength="50" placeholder="请输入商户号" />
          </el-form-item>
        </el-col>

        <el-col :span="11" :offset="1" v-if="payConfForm.payType == '5'">
          <el-form-item label="伙伴码" prop="terminalNo">
            <el-input v-model="payConfForm.terminalNo" maxlength="50" placeholder="请输入伙伴码" />
          </el-form-item>
        </el-col>
        <el-col :span="23" v-if="payConfForm.payType == '5'">
          <el-form-item label="密钥" prop="secretKey" :rules="{ required: true, message: '请输入密钥', trigger: 'blur',}">
            <el-input v-model="payConfForm.secretKey" maxlength="50" placeholder="请输入密钥" />
          </el-form-item>
        </el-col>
        <!-- <el-col v-if="payConfForm.payType == '5'">
          <el-form-item :label="accountList.length==1?'结算账户号':`结算账户号${index+1}` " v-for="(item,index) in accountList" :key="index">
            <div class="accontMoale">
              <el-input v-model="item.value" placeholder="请输入结算账户号" style="width: 450px;"/>
              <div class="action_btn">
                <p @click="addAccount" v-show="index === accountList.length - 1">添加</p>
                <p @click="removeAccount(index)" v-show="accountList.length>1">删除</p>
              </div>
            </div>
          </el-form-item>
        </el-col> -->
        <el-col :span="24" v-if="payConfForm.payType == '3'">
          <div style="font-size: 22px; font-weight: bolder; margin-top: 20px">
            通联支付配置
            <hr />
          </div>
        </el-col>

        <el-col :span="24" v-if="payConfForm.payType == '3'">
          <el-form-item label="到账模式" prop="tlFusFlag" :rules="{ required: payConfForm.payType == '3', message: '请选择到账模式', trigger: 'change',}">
            <el-select v-model="payConfForm.tlFusFlag" placeholder="请选择到账模式" clearable :style="{ width: '100%' }">
              <el-option label="普通到账（不分账、不班结实时到账）" value="0"></el-option>
              <el-option label="启动分账、班结实时到账（可选）" value="1"></el-option>
            </el-select>
          </el-form-item>
        </el-col>

        <el-col :span="24" v-if="payConfForm.tlFusFlag == '1'">
          <el-form-item label="是否班结实时到账" prop="tlClassFlag" :rules="{ required: payConfForm.tlFusFlag == '1', message: '请选择是否分账', trigger: 'change',}">
            <el-select v-model="payConfForm.tlClassFlag" placeholder="是否班结实时到账" clearable :style="{ width: '100%' }">
              <el-option label="启动班结实时到账" value="1"></el-option>
              <el-option label="普通到账（固定时间打款）" value="0"></el-option>
            </el-select>
          </el-form-item>
        </el-col>

        <el-col :span="11" v-if="payConfForm.payType == '3'">
          <el-form-item label="商户号" prop="mno" :rules="{ required: payConfForm.tlFusFlag == '0', message: '请填写商户号', trigger: 'change',}">
            <el-input v-model="payConfForm.mno" maxlength="50" placeholder="请输入商户号" />
          </el-form-item>
        </el-col>

        <el-col :span="11" :offset="1" v-if="payConfForm.payType == '3'">
          <el-form-item label="通联支付appid" prop="allinpayAppId" :rules="{ required: payConfForm.tlFusFlag == '0', message: '请填写通联支付appid', trigger: 'change',}">
            <el-input v-model="payConfForm.allinpayAppId" maxlength="50" placeholder="通联支付appid" />
          </el-form-item>
        </el-col>

        <el-col :span="23" v-if="payConfForm.payType == '3'">
          <el-form-item label="RSA私钥" prop="allinpayRSAKey" :rules="{ required: payConfForm.tlFusFlag == '0', message: '请填写RSA私钥', trigger: 'change',}">
            <el-input v-model="payConfForm.allinpayRSAKey" placeholder="请输入RSA私钥" />
          </el-form-item>
        </el-col>

        <el-col :span="11" v-if="payConfForm.payType == '3'">
          <el-form-item label="油站编码" prop="tlOilStationNo" :rules="{ required: payConfForm.tlFusFlag == '1', message: '请填写油站编码', trigger: 'change',}">
            <el-input v-model="payConfForm.tlOilStationNo" maxlength="50" placeholder="请输入商户号" />
          </el-form-item>
        </el-col>

        <el-col :span="11" :offset="1" v-if="payConfForm.payType == '3'">
          <el-form-item label="sysID" prop="tlSysId" :rules="{ required: payConfForm.tlFusFlag == '1', message: '请填写sysID', trigger: 'change',}">
            <el-input v-model="payConfForm.tlSysId" maxlength="50" placeholder="请输入sysID" />
          </el-form-item>
        </el-col>

        <el-col :span="11" v-if="payConfForm.payType == '3'">
          <el-form-item label="班结appid" prop="tlAppId" :rules="{ required: payConfForm.tlFusFlag == '1', message: '请填写班结的appid', trigger: 'change',}">
            <el-input v-model="payConfForm.tlAppId" maxlength="50" placeholder="请输入班结的appid" />
          </el-form-item>
        </el-col>

        <el-col :span="11" :offset="1" v-if="payConfForm.payType == '3'">
          <el-form-item label="班结密钥" prop="tlAppKey" :rules="{ required: payConfForm.tlFusFlag == '1', message: '请填写班结的密钥', trigger: 'change',}">
            <el-input v-model="payConfForm.tlAppKey" maxlength="50" placeholder="请输入班结的密钥" />
          </el-form-item>
        </el-col>

        <el-col :span="24" v-if="payConfForm.payType == '3' && payConfForm.tlFusFlag == '1'">
          <el-card class="card-table">
            <el-row :gutter="10" class="mb8">
              <el-col :span="1.5">
                <el-button type="primary" size="mini" @click="handleSchedulingAdd">新增排班</el-button>
              </el-col>
              <!--
          <right-toolbar
            :showSearch.sync="showSearch"
            @queryTable="getList"
          ></right-toolbar>
          -->
            </el-row>
            <el-table :data="payConfForm.shiftClasseList" style="width: 100%">
              <af-table-column label="班次标识" prop="shiftMask" align="left">
              </af-table-column>
              <af-table-column label="班次标识" prop="shiftStartTime" align="left">
              </af-table-column>
              <af-table-column label="班次标识" prop="shiftEndTime" align="left">
              </af-table-column>

              <af-table-column label="操作" align="left">
                <template slot-scope="scope">
                  <el-button type="text" @click="handleDelShiftClasse(scope.row)" size="mini">删除排班</el-button>
                  <el-button type="text" @click="handleEditShiftClasse(scope.row, scope.$index)"
                    size="mini">编辑排班</el-button>
                </template>
              </af-table-column>
            </el-table>
          </el-card>
        </el-col>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button type="primary" @click="payConfSubmitForm" size="mini">确 定</el-button>
        <el-button @click="handlePayConfClose" size="mini">取 消</el-button>
      </div>
    </el-dialog>

    <!-- 支付渠道列表 -->
    <el-dialog title="支付渠道列表" :visible.sync="payWayListOpen" width="800px" append-to-body>
      <el-card class="card-table">
        <el-row :gutter="10" class="mb8">
          <el-col :span="1.5">
            <el-button type="primary" size="mini" @click="handlePayConfAdd">新增渠道</el-button>
          </el-col>
          <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
        </el-row>
        <el-table :data="payWayList" style="width: 100%" v-loading="payWayListLoading">
          <af-table-column label="渠道ID" prop="payWayId" align="left">
          </af-table-column>
          <af-table-column label="应用渠道" prop="appType" align="left">
            <template slot-scope="scope">
              {{ scope.row.appType == "1" ? "微信" : "" }}
              {{ scope.row.appType == "2" ? "支付宝" : "" }}
              {{ scope.row.appType == "3" ? "银行卡" : "" }}
              {{ scope.row.appType == "4" ? "POS机" : "" }}
            </template>
          </af-table-column>
          <af-table-column label="使用类型" prop="useType" align="left">
            <template slot-scope="scope">
              {{ scope.row.useType == "1" ? "消费" : "" }}
              {{ scope.row.useType == "0" ? "充值" : "" }}
            </template>
          </af-table-column>
          <af-table-column label="支付渠道" prop="payType" align="left">
            <template slot-scope="scope">
              {{ scope.row.payType == "1" ? "随行付" : "" }}
              {{ scope.row.payType == "2" ? "云闪付" : "" }}
              {{ scope.row.payType == "3" ? "通联支付" : "" }}
              {{ scope.row.payType == "4" ? "金控支付" : "" }}
              {{ scope.row.payType == "5" ? "云化支付" : "" }}
            </template>
          </af-table-column>
          <af-table-column label="费率" prop="serviceCharge" align="left">
            <template slot-scope="scope">
              {{ scope.row.serviceCharge + "‰" }}
            </template>
          </af-table-column>

          <af-table-column label="更新时间" prop="updateTimeIns" align="left">
            <template slot-scope="scope">
              {{ scope.row.updateTimeIns ? scope.row.updateTimeIns : "-" }}
            </template>
          </af-table-column>

          <af-table-column label="操作" align="left">
            <template slot-scope="scope">
              <el-button type="text" @click="handlePayConfEdit(scope.row)" size="mini">编辑渠道参数</el-button>
            </template>
          </af-table-column>
        </el-table>
      </el-card>
      <pagination :hidden="payWayListTotal > 0 ? false : true" :total="payWayListTotal" :page.sync="payWayQuery.pageNum"
        :limit.sync="payWayQuery.pageSize" @pagination="getPayWayList" :autoScroll="true" />
      <div slot="footer" class="dialog-footer">
        <el-button @click="handlePayListClose" size="mini">取 消</el-button>
      </div>
    </el-dialog>

    <!-- 通联支付的排班 -->
    <el-dialog title="通联支付排班设置" :visible.sync="schedulingOpen" width="800px" append-to-body @close="schedulingClose">
      <el-form ref="shiftClasseForm" :model="shiftClasse" label-width="80px" label-position="top">
        <el-col :span="24">
          <el-form-item label="班次标识" prop="" :rules="{
              required: true,
              message: '请选择班次标识',
              trigger: 'change',
            }">
            <el-input v-model="shiftClasse.shiftMask" placeholder="请输入班次标识" />
          </el-form-item>
        </el-col>
        <el-col :span="11">
          <el-form-item label="开始时间" prop="shiftStartTime" :rules="{
              required: true,
              message: '班次开始时间',
              trigger: 'change',
            }">
            <el-time-picker v-model="shiftClasse.shiftStartTime" placeholder="班次开始时间" value-format="HH:mm:ss">
            </el-time-picker>
            {{ shiftClasse.shiftStartTime }}
          </el-form-item>
        </el-col>
        <el-col :span="11" :offset="1">
          <el-form-item label="结束时间" prop="shiftEndTime" :rules="{
              required: true,
              message: '班次结束时间',
              trigger: 'change',
            }">
            <el-time-picker v-model="shiftClasse.shiftEndTime" placeholder="班次结束时间" value-format="HH:mm:ss">
            </el-time-picker>
            {{ shiftClasse.shiftEndTime }}
          </el-form-item>
        </el-col>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button type="primary" @click="shiftClasseSubmitForm" size="mini">确 定</el-button>
        <el-button @click="
            () => {
              this.schedulingOpen = false;
            }
          " size="mini">取 消</el-button>
      </div>
    </el-dialog>

    <!-- 油罐列表 -->
    <el-dialog :title="'已经配置的油罐'" :visible.sync="oilTankListOpen" width="800px" append-to-body>
      <el-card class="card-table">
        <el-row :gutter="10" class="mb8">
          <el-col :span="1.5">
            <el-button type="primary" size="mini" @click="handleOilTankConfAdd">新增油罐</el-button>
          </el-col>
          <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
        </el-row>
        <el-table :data="oilTankList" style="width: 100%">
          <af-table-column prop="tankName" label="油罐名" align="left">
          </af-table-column>
          <af-table-column prop="oilId" label="油品" align="left">
            <template slot-scope="scope">
              {{ transitionOil(scope.row.oilId) }}
            </template>
          </af-table-column>
          <af-table-column prop="stationId" label="油站" align="left">
            <template slot-scope="scope">
              {{ transitionStationIdToName(scope.row.stationId) }}
            </template>
          </af-table-column>
          <af-table-column label="操作" align="left">
            <template slot-scope="scope">
              <el-button type="text" @click="handleOilTankConfEdit(scope.row)" size="mini">编辑油罐参数</el-button>
            </template>
          </af-table-column>
        </el-table>
      </el-card>
      <div slot="footer" class="dialog-footer">
        <el-button @click="handleOilTankListClose" size="mini">取 消</el-button>
      </div>
    </el-dialog>

    <!-- 配置油罐 -->
    <el-dialog :title="oilTankTitle" :visible.sync="oilTankConfOpen" width="800px" append-to-body>
      <el-form ref="oilTankConfForm" :model="oilTankConfForm" :rules="rules" label-width="80px" label-position="top">
        <el-col :span="23">
          <el-form-item label="油罐名" prop="tankName" :rules="{
              required: true,
              message: '请填写油罐名',
              trigger: 'change',
            }">
            <el-input v-model="oilTankConfForm.tankName" maxlength="50" placeholder="请输入油罐名" />
          </el-form-item>
        </el-col>

        <el-col :span="23">
          <el-form-item label="油品" prop="oilId" :rules="{
              required: true,
              message: '请选择油品',
              trigger: 'change',
            }">
            <el-select v-model="oilTankConfForm.oilId" placeholder="请选择此油罐的油品" clearable :style="{ width: '100%' }">
              <el-option :label="item.oilName + '-' + item.oilClass + '-' + item.oilType" :value="item.oilId"
                :key="item.oilId" v-for="item in oilList"></el-option>
            </el-select>
          </el-form-item>
        </el-col>

        <el-col :span="23">
          <el-form-item label="油站" :rules="{
              required: true,
              message: '请选择油站',
              trigger: 'change',
            }" prop="stationId">
            <el-select v-model="oilTankConfForm.stationId" placeholder="请选择此油罐归属的油站" clearable
              :style="{ width: '100%' }">
              <el-option :label="item.stationName" :value="item.stationId" :key="item.stationId"
                v-for="item in stationList"></el-option>
            </el-select>
          </el-form-item>
        </el-col>

        <el-col :span="11">
          <el-form-item label="罐高(mm)" prop="tankHight">
            <el-input v-model="oilTankConfForm.tankHight" maxlength="50" placeholder="请输入罐高" />
          </el-form-item>
        </el-col>

        <el-col :span="11" :offset="1">
          <el-form-item label="最大容量(L)" prop="tankCapacity">
            <el-input v-model="oilTankConfForm.tankCapacity" maxlength="50" placeholder="请输入最大容量" />
          </el-form-item>
        </el-col>

        <el-col :span="11">
          <el-form-item label="油高位警报设置(mm)" prop="heightAlarm">
            <el-input v-model="oilTankConfForm.heightAlarm" maxlength="50" placeholder="请输入油高位警报设置" />
          </el-form-item>
        </el-col>

        <el-col :span="11" :offset="1">
          <el-form-item label="低油位警报设置(mm)" prop="lowAlarm">
            <el-input v-model="oilTankConfForm.lowAlarm" maxlength="50" placeholder="请输入低油位警报设置" />
          </el-form-item>
        </el-col>

        <el-col :span="23">
          <el-form-item label="进油报警容错限制(L)" prop="addAlarm">
            <el-input v-model="oilTankConfForm.addAlarm" maxlength="50" placeholder="请输入进油报警容错限制" />
            <span>(进油入库升数-原发升数大于进油报警容错限制升数，即生成报警记录)</span>
          </el-form-item>
        </el-col>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button type="primary" @click="oilTankSubmitForm" size="mini">确 定</el-button>
        <el-button @click="cancel" size="mini">取 消</el-button>
      </div>
    </el-dialog>
    <!-- 二维码 -->
    <el-dialog :visible.sync="exportQrDialog" width="600px" append-to-body>
      <el-tabs v-model="activeName">
        <el-tab-pane label="公众号" name="gzh">
          <div style="text-align: center">
            <gzhQr :text="qrStr" @downloadImg="downloadImg" :nickName="currentExport.enterpriseName"
              :name="currentExport.enterpriseName">
            </gzhQr>
            <!-- <div>{{ "油企姓名：" }}{{ currentExport.enterpriseName }}</div> -->
          </div>
        </el-tab-pane>
      </el-tabs>
    </el-dialog>
  </div>
</template>

<script>
import {
  listDept,
  getDept,
  delDept,
  addDept,
  updateDept,
  listDeptExcludeChild,
  listTree,
  setMnoSplit,
} from "@/api/system/dept";
import {
  addEnterprise,
  delEnterprise,
  upEnterprise,
  getEnterpriseList,
  addPayWay,
  upPayWay,
  getPayWayList,
  addOilTank,
  upOilTank,
  getOilTankList,
  addOilAndGun,
  upOilAndGun,
  getOilAndGunList,
  getStationList,
  getOilList,
  getWxCardId,
  testEmpower,
  listEnterpriseStation,
  getMnoByEnterpriseIdApi,
  getSXFMnoServiceChargeApi,
  setMnoAllRateApi,
  selectMnoAllRateApi
} from "@/api/dept";
import Treeselect from "@riophae/vue-treeselect";
import "@riophae/vue-treeselect/dist/vue-treeselect.css";
import { regionData } from "element-china-area-data";
import { getToken } from "@/utils/auth";
import translateAddress from "@/utils/translateAddress.js";
import yfCity from "@/components/City/index";
import settings from "@/settings";
import gzhQr from "@/components/QrCode/dept-qr.vue";

export default {
  name: "Dept",
  components: { Treeselect, yfCity, gzhQr },
  data() {
    let validateEffectiveTimeType = (rule, value, callback) => {
      if (!value) {
        callback(new Error("请填入有效时间"));
        return;
      }
      if (value == 1) {
        if (this.createForm.effectiveTime.length == 0) {
          callback(new Error("请选择有效时间"));
          return;
        }
      }
      if (value == 2) {
        if (!this.createForm.effectiveDayNum) {
          callback(new Error("请填入有效天数"));
          return;
        }
      }
      callback();
    };
    return {
      exportQrDialog: false,
      activeName: "gzh",
      qrStr: "",
      currentExport: {},
      collapse: false,
      wxCardLoading: false,
      regionDataOptions: regionData, // 地址组件
      selectedRegionData: [],
      dateRangeCreatedDate: [],
      // 遮罩层
      showSearch: true,
      // 弹出层标题
      title: "",
      // 是否显示弹出层
      open: false,
      // 状态数据字典
      statusOptions: [],
      // 查询参数
      queryParams: {
        deptName: undefined,
        status: undefined,
      },

      // 表单校验
      rules: {},
      value2: "",
      groupRules: {
        // oilNameList: [
        //   { required: true, message: "请选择适用油品", trigger: "change" },
        //   { validator: validateOilNameList, trigger: "change" },
        // ],
        // effectiveTimeType: [
        //   { required: true, message: "请输入有效期类型", trigger: "change" },
        //   { validator: validateEffectiveTimeType, trigger: "change" },
        // ],
        // availableControl: [
        //   {
        //     required: true,
        //     message: "请选择有效期内时间控制",
        //     trigger: "change",
        //   },
        //   { validator: validateAvailableControl, trigger: "change" },
        // ],
        // verificationList:[
        //   { required: true, message: "请选择核销机构", trigger: "change" },
        //   { validator: validateVerificationList, trigger: "change" },
        // ],
        sfFlag: [
          { required: true, message: "请选择是否开启闪付", trigger: "blur" },
        ],
      },
      groupList: [],
      groupLoading: false,
      groupListTotal: 0,
      groupForm: {
        // enterpriseName: "",
        // status: "",
        // leader: "",
        // phone: "",
        // stationLatitude: "",
        // stationLongitude: "",
        // appId: "",
        // appSecret: "",
        // originId: "",
        // gzhAppId: "",
        // gzhAppSecret: "",
        // mno: "",
        // mnoStatus: "",
        // mnoArray: "",
        // mnoProportion: "",
        // merchantNo: "",
        // terminalId: "",
        // yunKey: "",
        sfFlag: 0, //是否开启闪付 0 没有开启 1开启

        regionDataList: [], //["120000","120100","120102"] 省市区码
        // detailRegionData: '', //详细地址
        // corporateAccountName: "", //开户行账户名
        // corporateAccount: "", // 开户行账号
        // corporateBank: "", // 对公银行
        // serviceCharge: "", // 手续费
        // licenseImg: "", // img图片的list  营业执照
        // licenseNo: "", // 营业执照编号
      },
      imgUpConfig: {
        headers: {
          Authorization: "Bearer " + getToken(),
        },
        addressUrl: process.env.VUE_APP_BASE_API + "/common/upload",
        limit: 2,
      },
      groupOpen: false,
      groupTitle: "",
      groupQuery: {
        pageSize: 10,
        pageNum: 1,
        enterpriseName: "",
        status: "",
        stationId: "",
      },
      currentGroup: {},
      payWayListOpen: false,
      payWayList: [],
      payWayQuery: {
        pageSize: 20,
        pageNum: 1,
        enterpriseId: undefined,
      },

      payWayListTotal: 0,
      payConfForm: {
        shiftClasseList: [],
      },
      shiftClasse: {},
      payConfTitle: "",
      payWayListLoading: false,
      payConfOpen: false,

      oilTankConfForm: {
        tankName: "", // 油罐名
        tankHight: "", //罐高(mm)
        tankCapacity: "", //最大容量(L)
        heightAlarm: "", //油高位警报设置(mm)
        lowAlarm: "", //低油位警报设置
        addAlarm: "", //进油报警容错限制

        oilId: "", // 油品
        stationId: "", // 油站id
      },
      oilTankTitle: "",
      oilTankList: [{}],
      oilTankTotal: 0,
      oilTankQuery: {
        pageSize: 10,
        pageNum: 1,
        enterpriseId: undefined,
      },
      oilTankListLoading: false,
      oilTankListOpen: false,
      oilTankConfOpen: false,
      stationQuery: {
        pageSize: 1000,
        pageNum: 1,
        enterpriseId: undefined,
      },
      stationList: [],
      oilQuery: {
        pageSize: 1000,
        pageNum: 1,
        enterpriseId: undefined,
      },
      oilList: [],
      schedulingForm: {},
      schedulingOpen: false,
      schedulingEditIndex: undefined,
      enterpriseList: [],
      stationListQuery: [],
      drawerRate:false,
      formValidateForm:{ },
      isSepaRate:false,
      formValidateFormSepa:{},
      options: [],
      rateTypeMap1: {
        "01": "微信费率",
        "02": "支付宝费率",
        "06": "银联单笔小于等于1000费率",
        "07": "银联单笔大于1000费率",
      },
      rateTypeMap2: {
        "01": "微信费率",
        "02": "支付宝费率",
        "06": "银联单笔小于1000贷记卡费率",
        "061": "银联单笔小于1000借记卡费率",
        "07": "银联单笔大于1000贷记卡费率",
        "071": "银联单笔大于1000借记卡费率",
        "072": "银联单笔大于1000借记卡封顶手续费",
        // 添加其他枚举值的映射
      },
      rateTypeMap3: {
        "01": "微信贷记卡费率",
        "011": "微信借记卡费率",
        "012": "微信借记卡封顶手续费",
        "02": "支付宝贷记卡费率",
        "021": "支付宝借记卡费率",
        "022": "支付宝借记卡封顶手续费",
        "06": "银联单笔小于1000贷记卡费率",
        "061": "银联单笔小于1000借记卡费率",
        "07": "银联单笔大于1000贷记卡费率",
        "071": "银联单笔大于1000借记卡费率",
        "072": "银联单笔大于1000借记卡封顶手续费",
        // 添加其他枚举值的映射
      },
      rateTypeMap4: {
        "01": "微信贷记卡费率",
        "011": "微信借记卡费率",
        "012": "微信借记卡封顶手续费",
        "02": "支付宝贷记卡费率",
        "021": "支付宝借记卡费率",
        "022": "支付宝借记卡封顶手续费",
        "03": "翼支付贷记卡费率",
        "031": "翼支付借记卡费率",
        "032": "翼支付借记卡封顶手续费",
        "06": "银联单笔小于1000贷记卡费率",
        "061": "银联单笔小于1000借记卡费率",
        "07": "银联单笔大于1000贷记卡费率",
        "071": "银联单笔大于1000借记卡费率",
        "072": "银联单笔大于1000借记卡封顶手续费",
        // Add other mappings as needed
      },
       rateTypeMap5: {
        "21": "贷记卡费率",
        "22": "借记卡费率",
        "23": "借记卡手续费封顶值",
        "24": "云闪付贷记卡费率",
        "25": "云闪付的借记卡费率",
      },
      wxrate:'-',//微信当前费率
      zfbrate:'-',//支付宝当前费率
      yldrate1:'-',//银联单笔小于等于1000费率
      yldrate2:'-',//银联单笔大于1000费率
      yhjjrate:'-',//银行卡借记卡当前费率
      yhdjrate:'-',//银行卡贷记卡当前费率
      yhkfdrate:'-',//银行卡借记卡当前封顶
      vLoading:false,
      flrate:{
        wxdjk_rate:'-',
        wxjjk_rate:"-",
        zfbdjk_rate:'-',
        zfbjjk_rate:'-',
        yldjk_rate:'-',
        yldjjk_rate:'-',
        yldjk_rate2:'-',
        yljjk_rate2:'-'
      },//借贷分离费率
      accountList:[{value:null}],//结算账户
    };
  },
  created() {
    if (this.$store.state.user.userLevel === "1") {
      this.getStationListQuery(this.presentEnterprise.enterpriseId);
    } else if ([null,'','7'].includes(this.$store.state.user.userLevel) ) {
      this.getEnterpriseListQuery();
    }
    this.getList();
    this.getGroupList();
    this.getAllOilList();
  },
  methods: {
    addAccount(){
      this.accountList.push({/* Add new account object here */});
    },
    removeAccount(index){
      this.accountList.splice(index, 1);
    },
    handleClose(done) {
        this.$confirm('确认关闭？')
          .then(_ => {
            done();
            this.$refs['formValidateForm'].resetFields();
          })
          .catch(_ => {});
    },
    validateInput(rule, value, callback) {
      const floatValue = parseFloat(value);
      if (!isNaN(floatValue) && floatValue >= 18.75 && floatValue <= 9999999.99 && /^\d+(\.\d{1,2})?$/.test(value)) {
        // 验证通过
        callback();
      } else {
        callback(new Error('请输入值不低于18.75，最多两位小数'));
      }
    },
    // 费率设置
    async onRateSetting(row){
      const res=await getMnoByEnterpriseIdApi(row.enterpriseId)
      this.options=res.map(item=>({value:item.mno,babel:item.mno}))
      if(res.length==0){ 
        this.$message.error('暂无查询到商户号')
        this.drawerRate=false
      }else{ 
        this.drawerRate=true
        this.formValidateForm={}
      }
    },

    // 费率设置保存
    async onSubmitForm(){
      if(this.isSepaRate){ 
         this.$refs['formValidateFormSepa'].validate((valid) => {
          if (valid) {
            alert('submit!');
          } else {
            console.log('error submit!!');
            return false;
          }
        });
      }else{ 
        this.$refs['formValidateForm'].validate(async(valid) => {
          console.log(this.formValidateForm);
          if (valid) {
            const params={ 
              wechatDebitScheduledRate:this.formValidateForm.wxrate,
              alipayDebitScheduledRate:this.formValidateForm.zfbrate,
              unionPayDebitScheduledRate:this.formValidateForm.ylrate,
              unionPayDebitScheduledRateOver1000:this.formValidateForm.ylrate2,
              bankCardDebitScheduledRate:this.formValidateForm.jjkrate,
              bankCardCreditScheduledRate:this.formValidateForm.djkrate,
              debitCardCap:this.formValidateForm.fdrate,
              mno:this.formValidateForm.merchantNumber,
              status:'0'
            }
            const res=await setMnoAllRateApi(params)
            if(res&&res.code==200){ 
              this.$message.success(res&&res.msg)
              this.drawerRate=false
              this.$refs['formValidateForm'].resetFields();
            }else{ 
              this.$message.error(res&&res.msg)
            }
        } else {
            console.log('error submit!!');
            return false;
          }
        });
      }
      
    },
    // onSepaRate(val){
    //   if(val==1){ 
    //     this.isSepaRate=true
    //     // this.$refs['formValidateForm'].resetFields();
    //   }else if(val==2){ 
    //     this.isSepaRate=false
    //     // this.$refs['formValidateFormSepa'].resetFields();
    //   }
    // },
    // 取消费率保存
    onResetForm() {
      if(this.isSepaRate){ 
        this.$nextTick(()=>{ 
           this.$refs['formValidateFormSepa'].resetFields();
        })
       
      }else{ 
        this.$nextTick(()=>{ 
          this.$refs['formValidateForm'].resetFields();
        })
        this.wxrate='-'
        this.zfbrate='-'
        this.yldrate1='-'
        this.yldrate2='-'
        this.yhjjrate='-'
        this.yhdjrate='-'
        this.yhkfdrate='-'
      }
        this.drawerRate=false
    },
    async getRate(val){
        this.vLoading=true
        this.wxrate='-'
        this.zfbrate='-'
        this.yldrate1='-'
        this.yldrate2='-'
        this.yhjjrate='-'
        this.yhdjrate='-'
        this.yhkfdrate='-'
      if(this.formValidateForm.merchantNumber){ 
        const res=await getSXFMnoServiceChargeApi(val)
        if(res&&res.data&&res.data.code=='0000'){ 
          const response=res.data.respData
          if(response.bizCode=='0000'){
            let rateTypeMap;
            if (response.qrcodeList.length == 4) {
              rateTypeMap = this.rateTypeMap1
            } else if (response.qrcodeList.length == 7) {
              rateTypeMap = this.rateTypeMap2
            } else if (response.qrcodeList.length == 11) {
              rateTypeMap = this.rateTypeMap3
            } else if (response.qrcodeList.length == 14) {
              rateTypeMap = this.rateTypeMap4
            }
            const selectedRates = response.qrcodeList.map(item => ({
              rateType:item.rateType,
              rateTypeName: this.mapRateTypeToText(item.rateType, rateTypeMap),
              rate: (Number(item.rate) * 10).toFixed(2),
            }));
            // if(selectedRates.length==4||selectedRates.length==7){ 
            if(selectedRates.length){ 
              selectedRates.forEach(item=>{ 
                if(item.rateType=='01'){ 
                  this.wxrate=item.rate
                }if(item.rateType=='02'){ 
                  this.zfbrate=item.rate
                }
                if(item.rateType=='06'){ 
                  this.yldrate1=item.rate
                }
                if(item.rateType=='07'){ 
                  this.yldrate2=item.rate
                }
              })
            }
            if(selectedRates.length==4){ 
              selectedRates.forEach(item=>{ 
                if(item.rateType=='06'){ 
                  this.yldrate1=item.rate
                }
                if(item.rateType=='07'){ 
                  this.yldrate2=item.rate
                }
              })
            }
            if(selectedRates.length==11||selectedRates.length==14){ 
              selectedRates.forEach(item=>{ 
                if(item.rateType=='01'){ 
                  this.flrate.wxdjk_rate=item.rate
                }if(item.rateType=='011'){ 
                  this.flrate.wxjjk_rate=item.rate
                }if(item.rateType=='02'){ 
                  this.flrate.zfbdjk_rate=item.rate
                } if(item.rateType=='021'){ 
                  this.flrate.zfbjjk_rate=item.rate
                } if(item.rateType=='06'){ 
                  this.flrate.yldjk_rate=item.rate
                } if(item.rateType=='061'){ 
                  this.flrate.yldjjk_rate=item.rate
                } if(item.rateType=='07'){ 
                  this.flrate.yldjk_rate2=item.rate
                } if(item.rateType=='071'){ 
                  this.flrate.yljjk_rate2=item.rate
                }
              })
            }
            const bankRatesList = response.bankCardRates.map(item => ({
              type:item.type,
              typeName: this.mapRateTypeToText(item.type, this.rateTypeMap5),
              rate: item.type!=23?(Number(item.rate) * 10).toFixed(2):item.rate,
              }));
            bankRatesList.forEach(item=>{
                  if(item.type=='21'){ 
                    this.yhdjrate=item.rate
                  }else if(item.type=='22'){ 
                    this.yhjjrate=item.rate
                  }else if (item.type=='23') {
                    this.yhkfdrate=item.rate
                  }
                })
          }else{ 
            this.$message.error(response&&response.bizMsg)
          }
        }else{ 
            this.$message.error(res&&res.data&&res.data.msg)
        }
        const res2=await selectMnoAllRateApi(val)
         if(res2&&res2.status=='0'){ 
            this.$set(this.formValidateForm,'wxrate',res2.wechatDebitScheduledRate) 
            this.$set(this.formValidateForm,'zfbrate',res2.alipayDebitScheduledRate)
            this.$set(this.formValidateForm,'ylrate',res2.unionPayDebitScheduledRate)
            this.$set(this.formValidateForm,'ylrate2',res2.unionPayDebitScheduledRateOver1000)
            this.$set(this.formValidateForm,'djkrate',res2.bankCardCreditScheduledRate)
            this.$set(this.formValidateForm,'jjkrate',res2.bankCardDebitScheduledRate)
            this.$set(this.formValidateForm,'fdrate',res2.debitCardCap)
            this.$set(this.formValidateForm,'merchantNumber',res2.mno)
        }else{ 
          this.formValidateForm = {};
          this.$refs['formValidateForm'].resetFields();
           this.$set(this.formValidateForm,'merchantNumber',val)
        }
      }else{ 
        this.$message.warning('请选择随行付商户号')
      }
      this.vLoading=false
      
    },
    mapRateTypeToText(rateType, rateTypeMap) {
      return rateTypeMap[rateType] || "未知费率类型";
    },
    // 导出二维码
    exportQr(row) {
      // console.log(row);
      let url = window.location.origin;
      let baseURL = "";
      switch (url) {
        case "https://yftx.xailife.com":
          baseURL = settings.baseURL;
          break;
        case "https://yftx-test.xailife.com":
          baseURL = settings.baseTestURL;
          break;
        case "https://yftx-test.xailife.com":
          baseURL = settings.baseDevURL;
          break;
        case "https://zh-admin.91cheyibao.com":
          baseURL = settings.baseCheyibaoURL;
          break;
        default:
          baseURL = settings.baseDevURL;
          break;
      }
      // 公众号
      this.currentExport = JSON.parse(JSON.stringify(row));
      this.qrStr = `${baseURL}/${row.enterpriseId}/my`;
      console.log(this.qrStr);

      this.exportQrDialog = true;
    },
    downloadImg() {
      this.msgSuccess("导出成功~");
    },
    // 改变切换油企时
    handleSelectChange(val) {
      this.groupQuery.stationId = null;
      this.getStationListQuery(val);
    },
    // 查询油企
    getEnterpriseListQuery() {
      getEnterpriseList().then((res) => {
        this.enterpriseList = res.rows;
      });
    },
    getStationListQuery(val) {
      listEnterpriseStation({ enterpriseId: val }).then((res) => {
        this.stationListQuery = res;
      });
    },
    handleChangeUseType(val) {
      if (val == 0) {
        this.payConfForm.channelFeePayer = "1";
      }
    },
    // 第三方授权
    handleTest() {
      testEmpower().then((res) => {
        console.log(res);
        const a = document.createElement("a");
        a.style.display = "none";
        a.href = res.msg;
        document.body.appendChild(a);
        a.click();
        document.body.removeChild(a);
      });
    },
    schedulingClose() {
      this.schedulingEditIndex = undefined;
    },
    handleDelShiftClasse(row, index) {
      this.payConfForm.shiftClasseList.splice(index, 1);
    },
    handleEditShiftClasse(row, index) {
      this.shiftClasse = JSON.parse(JSON.stringify(row));
      this.schedulingEditIndex = index;
      this.schedulingOpen = true;
    },
    setWxCardId() {
      if (!this.groupForm.gzhAppId || !this.groupForm.cardLogo) {
        this.msgError("请先完善公众号的相关信息后再来生成会员卡");
        return;
      }
      this.wxCardLoading = true;
      getWxCardId({
        enterpriseName: this.groupForm.enterpriseName,
        gzhAppId: this.groupForm.gzhAppId,
        cardLogo: this.groupForm.cardLogo,
        // cardLogo: 'http://10.34.100.29:9090/qujia-admin/uploadfile/images/upload/2023/04/24/281a5f49-7c65-4826-9f05-ca79bf5c38ea.png'
      })
        .then((res) => {
          console.log("生成卡号", res);
          if (res.code == 200) {
            this.groupForm.cardId = res.msg;
          } else {
            throw new Error("生成会员卡出错");
          }
        })
        .catch((err) => {
          this.msgError("生成失败，请检查配置");
        })
        .finally(() => {
          this.wxCardLoading = false;
        });
    },
    translateCodeToAddress(codeArr) {
      return translateAddress(codeArr);
    },
    handleGroupAdd(row) {
      this.groupTitle = "添加油企";
      this.groupForm = {
        regionDataList: [],
        sfFlag: "0",
      };
      this.groupOpen = true;
      this.$nextTick(() => {
        this.$refs.groupForm.clearValidate();
      });
    },
    handleGroupDel(row) {
      this.$confirm("确认删除此油企？", "警告", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
      })
        .then(function () {
          return delEnterprise(row);
        })
        .then(() => {
          this.getGroupList();
          this.msgSuccess("删除油企成功");
        });
    },
    handleGroupEdit(row) {
      this.groupTitle = "修改油企";
      this.groupForm = JSON.parse(JSON.stringify(row));
      this.groupOpen = true;
    },
    getGroupList() {
      this.groupLoading = true;
      const params = { ...this.groupQuery };
      if (params.enterpriseId2) {
        params.enterpriseId = params.enterpriseId2;
      }
      if (this.dateRangeCreatedDate && this.dateRangeCreatedDate.length) {
        params.beginTime = this.dateRangeCreatedDate[0];
        params.endTime = this.dateRangeCreatedDate[1];
      }
      getEnterpriseList(params)
        .then((res) => {
          this.groupListTotal = res.total;
          this.groupList = res.rows;
        })
        .finally(() => {
          this.groupLoading = false;
        });
    },
    getPayWayList() {
      this.payWayListLoading = true;
      getPayWayList(this.payWayQuery)
        .then((res) => {
          this.payWayListTotal = res.total;
          this.payWayList = res.rows;
        })
        .finally((err) => {
          this.payWayListLoading = false;
        });
    },
    getOilTankList() {
      this.oilTankListLoading = true;
      getOilTankList(this.oilTankQuery)
        .then((res) => {
          this.oilTankTotal = res.total;
          this.oilTankList = res.rows;
        })
        .finally((err) => {
          this.oilTankListLoading = false;
        });
    },
    getStationByEnterpriseId() {
      this.stationQuery.enterpriseId = this.currentGroup.enterpriseId;
      getStationList(this.stationQuery).then((res) => {
        if (res.rows == null) {
          this.stationList = [];
        }
        this.stationList = res.rows;
        console.log(this.stationList);
      });
    },
    getAllOilList() {
      // this.oilQuery.enterpriseId = this.currentGroup.enterpriseId
      getOilList(this.oilQuery).then((res) => {
        if (res.rows == null) {
          this.oilList = [];
        }

        this.oilList = res.rows;
      });
    },
    transitionOil(id) {
      const oil = this.oilList.find((res) => {
        return res.oilId == id;
      });
      if (!oil) {
        return "";
      }
      return oil.oilName + "-" + oil.oilClass + "-" + oil.oilType;
    },
    transitionStationIdToName(id) {
      const station = this.stationList.find((res) => {
        return res.stationId == id;
      });
      if (!station) {
        return "";
      }
      return station.stationName;
    },
    getQueryData(data) {
      let queryData = data;
      Object.keys(queryData).forEach((key) => {
        if (
          queryData[key] === "" ||
          queryData[key] === undefined ||
          queryData[key] === null
        ) {
          delete queryData[key];
        }
      });
      return queryData;
    },
    groupSubmitForm: function () {
      this.$refs["groupForm"].validate((valid) => {
        if (valid) {
          let groupForm = this.getQueryData(this.groupForm);
          if (groupForm.enterpriseId != undefined) {
            upEnterprise(groupForm).then((res) => {
              this.msgSuccess("更新成功");
              this.getGroupList();
              this.groupOpen = false;
            });
          } else {
            addEnterprise(this.groupForm).then((res) => {
              this.msgSuccess("新增油企成功");
              this.getGroupList();
              this.groupOpen = false;
            });
          }
        }
      });
    },
    oilTankSubmitForm: function () {
      this.oilTankConfForm.enterpriseId = this.currentGroup.enterpriseId;
      this.$refs["oilTankConfForm"].validate((valid) => {
        if (valid) {
          if (this.oilTankConfForm.tankId != undefined) {
            upOilTank(this.oilTankConfForm).then((res) => {
              this.msgSuccess("更新油罐成功");
              this.getOilTankList();
              this.oilTankConfOpen = false;
            });
          } else {
            addOilTank(this.oilTankConfForm).then((res) => {
              this.msgSuccess("新增油罐成功");
              this.getOilTankList();
              this.oilTankConfOpen = false;
            });
          }
        }
      });
    },
    shiftClasseSubmitForm: function () {
      this.$refs["shiftClasseForm"].validate((valid) => {
        if (valid) {
          if (this.schedulingEditIndex === undefined) {
            this.payConfForm.shiftClasseList.push(this.shiftClasse);
            this.shiftClasse = {};
            this.schedulingOpen = false;
          } else {
            this.payConfForm.shiftClasseList.splice(
              this.schedulingEditIndex,
              1
            );
            this.payConfForm.shiftClasseList.push(this.shiftClasse);
            this.shiftClasse = {};
            this.schedulingOpen = false;
            this.schedulingEditIndex === undefined;
          }
        }
      });
    },
    payConfSubmitForm() {
      this.payConfForm.enterpriseId = this.currentGroup.enterpriseId;
      // const arr=this.accountList.map(item => Number(item.value))
      this.$refs["payConfForm"].validate((valid) => {
        if (valid) {
          // this.payConfForm.yunSysUserList=arr
          if (this.payConfForm.payWayId != undefined) {
            this.payConfForm.mno = this.payConfForm.mno.trim();
            upPayWay(this.payConfForm).then((res) => {
              this.msgSuccess("更新支付渠道成功");
              this.getPayWayList();
              this.payConfOpen = false;
            });
          } else {
            addPayWay(this.payConfForm).then((res) => {
              this.msgSuccess("新增支付渠道成功");
              this.getPayWayList();
              this.payConfOpen = false;
            });
          }
          console.log('测试支付配置参数',this.payConfForm);
        }
      });
    },
    groupCancel() {
      this.groupOpen = false;
    },
    handleOilTankListOpen(row) {
      this.currentGroup = row;
      this.oilTankQuery.enterpriseId = this.currentGroup.enterpriseId;
      this.getOilTankList();
      this.getStationByEnterpriseId();
      this.oilTankListOpen = true;
    },
    handleOilTankConfAdd() {
      this.oilTankTitle = "新增油罐";
      this.oilTankConfForm = {};
      this.oilTankConfOpen = true;
    },
    handleOilTankConfEdit(row) {
      this.getStationByEnterpriseId();
      console.log(22222, row);
      this.oilTankTitle = "修改油罐";
      this.oilTankConfForm = JSON.parse(JSON.stringify(row));
      this.oilTankConfOpen = true;
    },
    handleOilTankListClose() {
      this.oilTankListOpen = false;
    },
    handlePayListOpen(row) {
      this.currentGroup = row;
      this.payWayQuery.enterpriseId = this.currentGroup.enterpriseId;
      this.getPayWayList();
      this.payWayListOpen = true;
    },
    handlePayListClose() {
      this.payWayListOpen = false;
    },
    handlePayConfOpen() {
      this.payConfForm = {};
      this.payConfOpen = true;
    },
    handlePayConfAdd() {
      this.payConfForm = {
        shiftClasseList: [],
      };
      this.payConfOpen = true;
    },
    handleSchedulingAdd() {
      this.schedulingForm = {};
      this.schedulingOpen = true;
    },
    handlePayConfEdit(row) {
      this.payConfForm = JSON.parse(JSON.stringify(row));
      if (!this.payConfForm.shiftClasseList) {
        this.payConfForm.shiftClasseList = [];
      }
      this.payConfOpen = true;
    },
    handlePayConfClose() {
      this.payConfOpen = false;
      this.accountList=[{value:null}]
    },
    handleChangeRegionData(value) {
      console.log(this.groupForm.regionDataList);
      console.log(this.groupForm);
    },
    beforeAvatarUpload(file) {
      const isLt1M = file.size / 1024 / 1024 < 1;
      if (!isLt1M) {
        this.$message.error("上传头像图片大小不能超过 1MB!");
      }
      return isLt1M;
    },
    handleAvatarSuccess(response, file, fileList) {
      this.groupForm = {
        ...this.groupForm,
        licenseImg: response.url,
      };
    },
    handleCardLogoSuccess(response, file, fileList) {
      console.log(response);
      this.groupForm = {
        ...this.groupForm,
        cardLogo: response.url,
      };
    },

    /** 查询部门列表 */
    getList() {},
    // 取消按钮
    cancel() {
      this.open = false;
      this.reset();
    },

    // 表单重置
    reset() {
      this.form = {};
      this.dateRangeCreatedDate = [];
      this.resetForm("form");
    },
    /** 搜索按钮操作 */
    handleQuery() {
      this.getGroupList();
    },
    /** 重置按钮操作 */
    resetQuery() {
      this.dateRangeCreatedDate = [];
      this.resetForm("groupQuery");
      this.handleQuery();
    },
    //设置分账的参数
    handleMnoSplit(row) {
      this.$confirm('是否进行分账设置,点击确定跳转确认页面"', "警告", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
      })
        .then(() => {
          return setMnoSplit(row.deptId);
        })
        .then((res) => {
          // this.getList();
          window.open(res.msg, "_blank");
          //this.msgSuccess("分账设置成功");
        });
    },

    submitForm: function () {
      this.$refs["form"].validate((valid) => {
        if (valid) {
          if (this.form.deptId != undefined) {
          } else {
          }
        }
      });
    },

    /** 删除按钮操作 */
    handleDelete(row) {
      this.$confirm(
        '是否确认删除名称为"' + row.deptName + '"的数据项?',
        "警告",
        {
          confirmButtonText: "确定",
          cancelButtonText: "取消",
          type: "warning",
        }
      )
        .then(function () {
          return delDept(row.deptId);
        })
        .then(() => {
          this.getList();
          this.msgSuccess("删除成功");
        });
    },
  },
};
</script>
<style lang="scss" scoped>
.avatar-uploader {
  .el-upload {
    border: 1px dashed #d9d9d9;
    border-radius: 6px;
    cursor: pointer;
    position: relative;
    overflow: hidden;
  }

  .el-upload:hover {
    border-color: #409eff;
  }

  .avatar-uploader-icon {
    font-size: 28px;
    color: #8c939d;
    width: 178px;
    height: 178px;
    line-height: 178px;
    text-align: center;
  }

  .avatar {
    width: 178px;
    height: 178px;
    display: block;
  }
}

.button-from {
  width: 100%;
  display: flex;
  flex-wrap: wrap;

  .button-style {
    width: 430px;
    height: 80px;
    line-height: 115px;
  }
}

.card-table {
  margin-top: 20px;
  background-color: #f8f8f8;

  .el-button {
    margin-bottom: 20px;
    margin-right: 20px;
  }
}

::v-deep .el-form-item {
  .el-form-item__label {
    padding: 0;
    margin: 0;
    text-align: left;
  }

  .el-button--cyan {
    margin-left: 20px;
  }
}
::v-deep .add-drawer {
  overflow-y: auto;
}
::v-deep .add_ratedrawer{ 
  overflow: auto;
  .el-form{ 
    margin: 0 30px;
    .get_rate{ 
      .el-input-group__append{ 
        background-color: #409eff;
        color: #fff;
      }
    } 
  }
  .el-form{ 
    margin: 0 80px;
  }
  .bank_rate{
      display: flex;
      align-items: center;
      justify-content: space-between;
      font-size: 14px;
      line-height: 40px;
      padding-bottom: 20px;
    }
  .el-form-item__label{ 
    // padding-right: 20px;
    font-weight: normal;
  }
  .act_btn{ 
    text-align: right;
  }
  .act_btn_set{ 
    text-align: right;
    color: #409eff;
    div{ 
      font-size: 15px;
      cursor: pointer;
    }
    
  }
}
.accontMoale{ 
  display: flex;
  align-items: center;
  .action_btn{ 
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-size: 16px;
    p:first-child{
      padding: 0 20px;
      background-color: #409eff;
      border-radius: 8px;
      margin:0 20px;
      color: #fff;
    } 
    p:last-child{
      padding: 0 20px;
      border-radius: 8px;
      margin:0 20px;
      background-color: #fa0000;
      color: #fff;
    } 
  }
}
</style>
